feat: optimize information hierarchy and implement progressive disclo…#395
feat: optimize information hierarchy and implement progressive disclo…#395hussainjamal760 wants to merge 6 commits intoopen-telemetry:mainfrom
Conversation
…sure for instrumentation docs
✅ Deploy Preview for otel-ecosystem-explorer ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
jaydeluca
left a comment
jaydeluca
left a comment
There was a problem hiding this comment.
I left some comments on some of the wording, I'm not sure if this improves things (just yet). one of the challenges with this, is that telemetry varies based on the different configuration options, so I wonder if this could be misleading without that additional context that we provide on the telemetry tab
I also don't know if we are doing enough with the "Traces and Spans" description to provide context as to what the information in the badges mean. On the other page its a little more obvious that these refer to the span kinds emitted. The capabilities tab already provides some sort of summary around what metrics and spans it could produce, and I wonder if that could just be revamped in some way.
I agree with the idea of this PR to improve this page, but I think we might need to give it another iteration and see if we can come up with a different approach where we summarize things, but don't provide information that could be confusing without the additional context of configuration options
…ail-page.tsx Co-authored-by: Jay DeLuca <jaydeluca4@gmail.com>
…ail-page.tsx Co-authored-by: Jay DeLuca <jaydeluca4@gmail.com>
Thanks for the feedback , that makes sense. This was intended as a V1 focused mainly on improving scanability and reducing cognitive overload. I’ll iterate on the UX gradually across versions and explore approaches that provide better context without being misleading. I agree the Capabilities section may be a better place to evolve these summaries. |
|
|
||
| <TabsContent value="details" className="mt-0 p-4 sm:p-6"> | ||
| <div className="space-y-8"> | ||
| {/* Value Proposition Summary */} |
There was a problem hiding this comment.
im still not sure about this, i have two remaining concerns:
- We still aren't indicating what the glow badge values mean in the traces. At the very least we should be indicating that they are the "Span Kinds" emitted
- Listing all the metrics on the metric panel works when there a small number of metrics, but what about a case where an isntrumentation emits dozens? I dont think that would look good
I agree this page can be improved, but I'm not sure this is an improvement. Let's remove these changes from the PR for now and stick to just introducing the expand/collapsing of the telemetry signals.
For the rest of your ideas around progressive disclosure, I think it might be best to continue the conversation / brainstorming as part of our UI/UX redesign project: #370
| } | ||
|
|
||
| export function AttributeTable({ attributes }: AttributeTableProps) { | ||
| export function AttributeTable({ attributes, expandVersion = 0, collapseVersion = 0 }: AttributeTableProps) { |
There was a problem hiding this comment.
I dont think it makes sense to have the controls so far away from what they affect.
Can we add controls for metrics/ spans individually? So i can expand/collapse all the metrics or spans and the controls are right under each "Metrics" or "spans" heading?
2 participants
Issue: #394
Overview
This PR improves the UX of instrumentation detail pages by making the information easier to understand without changing any JSON data.
The goal was to reduce cognitive overload and create a clearer flow for users:
Key Changes
Reorganized information into clearer sections:
Added a simple “Telemetry Overview” section to explain metrics and traces in a more user-friendly way.
Improved visual structure using reusable UI components for better readability and scanning.
Scalability
Data Flow
Verification